<!DOCTYPE html>
<html lang="en-US"><head>
  <meta charset="utf-8">
  <title>Color picker</title>
  <link rel="stylesheet" href="styles.css">
</head>
<body>
<div id="container">
  <div id="palette" class="block">
    <div id="color-palette"></div>
    <div id="color-info"></div>
  </div>
  <div id="picker" class="block">
    <div class="ui-color-picker" data-topic="picker" data-mode="HWB">
    </div>

    <div id="picker-samples" sample-id="master" style="height: 166px;">

    </div>
    <div id="controls">
      <div id="delete">
        <div id="trash-can"></div>
      </div>
      <div id="void-sample" class="icon" data-active="false"></div>
    </div>
  </div>
  <div id="canvas">
    <div id="zindex" class="ui-input-slider" data-topic="z-index" data-info="z-index" data-max="20" data-sensitivity="10" data-value="1"><span class="ui-input-slider-info">z-index</span><div class="ui-input-slider-left"></div><input type="text" style="width: 50px;"><div class="ui-input-slider-right"></div></div>
    <div class="toggle-bg"></div></div>
</div>
<script src="./script.js"></script>


</body></html>